<html>
    <head>
        <meta content="text/html;charset=utf-8" http-equiv="Content-Type">
        <title>list</title>
        <meta name="viewport" content="initial-scale=1, maximum-scale=1">
        <link href="http://g.alicdn.com/msui/sm/0.6.2/css/sm.css" rel="stylesheet">
    </head>
    <body>
        <div class="page-group">
            <div class="page">
                <!-- 标题栏 -->
                <header class="bar bar-nav">
                    <a class="icon icon-left pull-left open-panel">
                    </a>
                    <a class="icon icon-refresh pull-right back" href="./land.html">
                    </a>
                    <h1 class="title">
                        化妆品
                    </h1>
                </header>
                <!--搜索栏-->
                <div class="bar bar-header-secondary">
                    <div class="searchbar">
                        <a class="searchbar-cancel">
                            取消
                        </a>
                        <div class="search-input">
                            <label class="icon icon-search" for="search">
                            </label>
                            <input id="search" placeholder="输入关键字..." type="search"/>
                        </div>
                    </div>
                </div>
                <!-- 这里是页面内容区 -->
                <div class="content">
                    <div class="content-block-title">
                        韩束
                    </div>
                    <div class="list-block">
                        <ul>
                            <li class="item-content">
                                <div class="item-media">
                                    <i class="icon icon-f7">
                                    </i>
                                </div>
                                <div class="item-inner">
                                    <div class="item-title">
                                        套装
                                    </div>
                                    <div class="item-after">
                                        墨菊深度补水保湿套组
                                    </div>
                                </div>
                            </li>
                            <li class="item-content">
                                <div class="item-media">
                                    <i class="icon icon-f7">
                                    </i>
                                </div>
                                <div class="item-inner">
                                    <div class="item-title">
                                        面膜
                                    </div>
                                    <div class="item-after">
                                        透白平衡睡眠面膜150g免洗
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <div class="content-block-title">
                        卡姿兰
                    </div>
                    <div class="list-block">
                        <ul>
                            <li class="item-content">
                                <div class="item-inner">
                                    <div class="item-title">
                                        套装
                                    </div>
                                    <div class="item-after">
                                        水润莹白系类礼盒装
                                    </div>
                                </div>
                            </li>
                            <li class="item-content">
                                <div class="item-inner">
                                    <div class="item-title">
                                        面膜
                                    </div>
                                    <div class="item-after">
                                        蜗牛系类
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                    <div class="content-block-title">
                        百雀羚
                    </div>
                    <div class="list-block">
                        <ul>
                            <li class="item-content item-link">
                                <div class="item-media">
                                    <i class="icon icon-f7">
                                    </i>
                                </div>
                                <div class="item-inner">
                                    <div class="item-title">
                                        商品名称
                                    </div>
                                    <div class="item-after">
                                        百雀羚肌初赋活致臻套装 水乳霜眼霜4件礼盒 送:随机瓶装小样2个
                                    </div>
                                </div>
                            </li>
                            <li class="item-content item-link">
                                <div class="item-media">
                                    <i class="icon icon-f7">
                                    </i>
                                </div>
                                <div class="item-inner">
                                    <div class="item-title">
                                        面膜
                                    </div>
                                    <div class="item-after">
                                        水嫩清纯
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
                <!-- 工具栏 -->
                <nav class="bar bar-tab">
                    <a class="tab-item external active" href="#">
                        <span class="icon icon-home">
                        </span>
                        <span class="tab-label">
                            首页
                        </span>
                    </a>
                    <a class="tab-item external" href="#">
                        <span class="icon icon-me">
                        </span>
                        <span class="tab-label">
                            买买买
                        </span>
                        <span class="badge">
                            2
                        </span>
                    </a>
                    <a class="tab-item external" href="#">
                        <span class="icon icon-star">
                        </span>
                        <span class="tab-label">
                            问大家
                        </span>
                    </a>
                    <a class="tab-item external" href="#">
                        <span class="icon icon-cart">
                        </span>
                        <span class="tab-label">
                            购物车
                        </span>
                    </a>
                    <a class="tab-item external" href="#">
                        <span class="icon icon-settings">
                        </span>
                        <span class="tab-label">
                            我的
                        </span>
                    </a>
                </nav>
                <!-- popup, panel 等放在这里 -->
            </div>
        </div>
        <div class="panel-overlay">
        </div>
        <!-- Left Panel with Reveal effect -->
        <div class="panel panel-left panel-reveal">
            <div class="content-block">
                <p>
                    这是一个侧栏
                </p>
                <p>
                    你可以在这里放用户设置页面
                </p>
                <!-- Click on link with "close-panel" class will close panel -->
                <p>
                    <a class="close-panel" href="#">
                        关闭
                    </a>
                </p>
            </div>
        </div>
        <script charset="utf-8" src="http://g.alicdn.com/sj/lib/zepto/zepto.js" type="text/javascript">
        </script>
        <script charset="utf-8" src="http://g.alicdn.com/msui/sm/0.6.2/js/sm.js" type="text/javascript">
        </script>
    </body>
</html>
